<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<style>
			@media screen and (min-width: 500px) and (max-width: 980px) {
				#app {
					width: 400px;
					height: 223px;
				}
			}
			@media screen and (min-width: 980px) and (max-width: 1500px) {
				#app {
					width: 800px;
					height: 446px;
					
				}
			}
			#app {
				background: pink;
			}
		</style>
	</head>
	<body>
		<div id="app">
			<video width="800" height="" id="start_video"
      class="start_video"
      style="object-fit:fill;"
      playsinline="true"
      webkit-playsinline="true"
      x-webkit-airplay="allow"
      airplay="allow"
      x5-video-player-type="h5"
      x5-video-player-fullscreen="true"
      x5-video-orientation="portrait"
      autoplay="autoplay"
      muted="true"
      src="./videos/1.mp4" controls="">
				<source src="myvideo.mp4" type="video/mp4"></source>
				<source src="myvideo.ogv" type="video/ogg"></source>
				<source src="myvideo.webm" type="video/webm"></source>
				<object width="" height="" type="application/x-shockwave-flash" data="myvideo.swf">
					<param name="movie" value="myvideo.swf" />
					<param name="flashvars" value="autostart=true&amp;file=myvideo.swf" />
				</object>
				当前浏览器不支持 video直接播放，点击这里下载视频： <a href="myvideo.webm">下载视频</a>
			</video>
		</div>
	</body>
</html>
